import Vue from 'vue'
import VueRouter from 'vue-router'
import store from '../store'

// 解决导航栏中的vue-router在3.0版本以上重复点菜单报错问题
const originalPush = VueRouter.prototype.push
const originalReplace = VueRouter.prototype.replace
VueRouter.prototype.push = function push (location) {
  return originalPush.call(this, location).catch(err => err)
}
VueRouter.prototype.replace = function replace (location) {
  return originalReplace.call(this, location).catch(err => err)
}

Vue.use(VueRouter)

const RouteView = {
  name: 'RouteView',
  render: (h) => h('router-view')
}

const routes = [
  {
    path: '/',
    redirect: '/home',
  },
  {
    path: '/login',
    alias: '/redirectTo',
    name: '登录',
    component: () => import('../views/Login/Index.vue'),
    meta: {},
  },
  {
    path: '/home',
    redirect: '/home/demo',
    component: () => import('../layout/Index.vue'),
    children: [
      {
        path: 'demo',
        name: 'Demo',
        component: () => import('../views/Demo/Index.vue'),
      },
      // 用户信息
      {
        path: 'user',
        name: '用户信息',
        component: () => import('../views/User/Index.vue'),
      },
      // 404
      {
        path: '*',
        name: '404',
        component: () => import('../views/NotFound/Index.vue'),
      }
    ]
  },
  {
    path: '*',
    name: '404',
    component: () => import('../views/NotFound/Index.vue'),
  }
]

// 动态生成breadCrumbs信息
const generateBreadCrumbs = (routes = [], parent = null) => {
  routes.forEach(route => {
    if (route.meta == null) route.meta = {}
    if (route.meta.breadCrumbs == null) route.meta.breadCrumbs = (parent && parent.meta.breadCrumbs) ? [...parent.meta.breadCrumbs] : []
    if (route.name && (parent == null || parent.redirect !== parent.path + '/' + route.path)) {
      route.meta.breadCrumbs.push({
        name: route.name,
        path: parent ? parent.path + '/' + route.path : route.path,
      })
    }
    if (route.children != null) {
      generateBreadCrumbs(route.children, route)
    }
  })
}
generateBreadCrumbs(routes)

const router = new VueRouter({
  routes
})

router.beforeEach((to, from, next) => {
  // 面包屑和multiTab
  if (to.path !== '/login' && to.path !== '/redirectTo') {
    store.commit('setBreadCrumbs', to.meta?.breadCrumbs || [])
    // 判断当前tabHistory是否包含
    const tabHistoryList = store.state.tabHistoryList
    if (!tabHistoryList.find(item => item.path === to.path)) {
      store.commit('addTabHistory', to)
    }
  } else {
    if (store.state.token) {
      if (!store.state.userInfo || !store.state.userInfo.id) {
        // 需要先获取用户信息
        store.dispatch('getUserInfo')
        store.dispatch('getMenuAndPermissions')
      }
    }
  }
  // 导航菜单selectedKeys
  if (to.meta.navKey) {
    if (!store.state.selectedNavKeys.includes(to.meta.navKey)) {
      store.commit('setSelectedNavKeys', [to.meta.navKey])
    }
  } else if (store.state.selectedNavKeys.length !== 0) {
    store.commit('setSelectedNavKeys', [])
  }
  next()
})

export default router
